<style scoped lang="less">
</style>

<template>
  <div class="container">
    <htable :tableData="tableData" :thlabel="thlabel" :isEdit="true"
    style="width: 100%;"
    @cell-change="change"
    @cell-click="cellClick">
    </htable>
  </div>
</template>

<script>
export default {
  data () {
    return {
      tableData: [
        {a: '1', b: '2', c: '3', d: '4', e: '5', f: '6'},
        {a: '1', b: '2', c: '3', d: '4', e: '5', f: '6'},
        {a: '1', b: '2', c: '3', d: '4', e: '5', f: '6'},
        {a: '1', b: '2', c: '3', d: '4', e: '5', f: '6'},
        {a: '1', b: '2', c: '3', d: '4', e: '5', f: '6'},
        {a: '1', b: '2', c: '3', d: '4', e: '5', f: '6'},
        {a: '1', b: '2', c: '3', d: '4', e: '5', f: '6'}
      ],
      thlabel: [
        {prop: 'a', label: '表头1'},
        {prop: 'b', label: '表头2'},
        {prop: 'c', label: '表头3'},
        {prop: 'd', label: '表头4'},
        {prop: 'e', label: '表头5'},
        {prop: 'f', label: '表头6'}
      ]
    }
  },
  methods: {
    change (event, row, col, currentRowData) {
      console.log('hello:----------------------------------')
      console.log('change-------currentRowData:' + currentRowData.a)
    },
    cellClick (event, row, col, currentRowData) {
      console.log('cellClick------currentRowData:' + currentRowData.a)
    }
  },
  mounted: function () {
  },
  components: {
  }
}
</script>
